<template>
	<view class="warp">

		<view class="box">
			<view class="timePick">
				<text @click="onShowDatePicker('datetime')">{{time}}</text>
				<tui-icon name="arrowright" :size="20" color='#999999'></tui-icon>
			</view>

			<mx-date-picker :show="showPicker" :type="type" :value="value" :show-tips="true" :show-seconds="true" @confirm="onSelected"
			 @cancel="onSelected" />
		</view>

		<view class="box">
			<view class="title">收益表(一)：</view>
			<t-table @change="change">
				<t-tr>
					<t-th style="background: rgba(110, 96, 158, 0.2);">8月份销售奖</t-th>
				</t-tr>
				<t-tr>
					<t-th>总销售量</t-th>
					<t-th>奖励标准</t-th>
					<t-th>合计收益</t-th>
					<t-th>实际收益</t-th>
				</t-tr>
				<t-tr>
					<t-td>{{ tableList.volume }}</t-td>
					<t-td>{{ tableList.caseProfit }}元/箱</t-td>
					<t-td>{{ tableList.total }}元</t-td>
					<t-td>{{ tableList.practical }}</t-td>
				</t-tr>
			</t-table>
		</view>

		<view class="box">
			<view class="title">收益分配表(二)：</view>
			<t-table @change="change">
				<t-tr>
					<t-th>姓名</t-th>
					<t-th>总销售量</t-th>
					<t-th>奖励标准</t-th>
					<t-th>发放奖金</t-th>
				</t-tr>
				<t-tr v-for="item in tableListTwo" :key="item.id">
					<t-td>{{ item.nickname }}</t-td>
					<t-td>{{ item.volume }}/箱</t-td>
					<t-td>{{ item.caseProfit }}元/箱</t-td>
					<t-td>{{ item.total }}元</t-td>
				</t-tr>
			</t-table>
		</view>

	</view>
</template>

<script>
	import tTable from '@/components/t-table/t-table.vue';
	import tTh from '@/components/t-table/t-th.vue';
	import tTr from '@/components/t-table/t-tr.vue';
	import tTd from '@/components/t-table/t-td.vue';
	import MxDatePicker from "@/components/mx-datepicker/mx-datepicker.vue";

	export default {
		components: {
			tTable,
			tTh,
			tTr,
			tTd,
			MxDatePicker
		},
		data() {
			return {
				userId: "",
				showPicker: false,
				time: '',
				type: "",
				value: '',
				tableList: [],
				tableListTwo: []
			};
		},
		onLoad() {
			//获取用户信息
			let userinfo = uni.getStorageSync("userInfo")
			this.userId = userinfo.id
			this.getNowFormatDate();

			console.log(this.time)


			let month = decodeURIComponent("2020-11-10 19:20:00")
			//获取数据
			this.$http.get(this.tui.interfaceUrl() + '/app/profit/calculateRebate?userId=' + this.userId + '&month=' + this.time)
				.then(res => {
					if (res.data.errno == 0) {
						console.log(res.data.data.myRebate)
						if(!res.data.data){
							this.tui.toast("暂无数据")
						}else{
							this.tableList = res.data.data.myRebate
							this.tableListTwo = res.data.data.list
						}
						
					}


				}).catch(err => {
					console.log(err)
				})

		},

		methods: {
			getNowFormatDate() {
				let date = new Date();
				let seperator1 = "-";
				let colon = ":";
				let year = date.getFullYear();
				let month = date.getMonth() + 1;
				let strDate = date.getDate();
				let h = date.getHours();
				let m = date.getMinutes();
				let s = date.getSeconds();
				if (month >= 1 && month <= 9) {
					month = "0" + month;
				}
				if (strDate >= 0 && strDate <= 9) {
					strDate = "0" + strDate;
				}
				let currentdate = year + seperator1 + month + seperator1 + strDate + " " + this.completeDate(h) + colon + this.completeDate(
					m) + colon + this.completeDate(s);
				this.time = currentdate
			},
			//补全0
			completeDate(value) {
				return value < 10 ? "0" + value : value;
			},
			onShowDatePicker(type) { //显示
				this.type = type;
				this.showPicker = true;
				this.value = this[type];
			},
			onSelected(e) { //选择
				this.showPicker = false;
				if (e) {
					this[this.type] = e.value;
					this.time = e.value
					//选择的值
					console.log('value => ' + e.value);
					//原始的Date对象
					// console.log('date => ' + e.date);
				}
			},
			change(e) {
				console.log(e.detail);
			},
			edit(item) {
				uni.showToast({
					title: item.name,
					icon: 'none'
				});
			}
		}
	};
</script>

<style>
	.box {
		width: 95%;
		margin: 0 auto;
		padding-top: 40upx;
	}

	.title {

		font-size: 32upx;
		font-family: Source Han Sans CN;
		font-weight: 500;
		color: #333333;
		margin-bottom: 10px;
	}

	.timePick {

		font-size: 28upx;
		font-family: Source Han Sans CN;
		font-weight: 400;
		color: #999999;
		display: flex;
		align-items: center;
	}
</style>
